import { defineConfig, presetIcons } from "unocss";
// import epIcons from "@iconify-json/ep/icons.json";
// import mdiIcons from "@iconify-json/mdi/icons.json";

export default defineConfig({
  content: {
    filesystem: ["./src/views/**/*.vue", "./src/layout/**/*.vue", "./src/components/**/*.vue"],
  },
  presets: [
    presetIcons({
      collections: {
        // ep: epIcons,
        // mdi: mdiIcons,
        ep: () => import("@iconify-json/ep/icons.json").then((i) => i.default),
        mdi: () => import("@iconify-json/mdi/icons.json").then((i) => i.default),
      },
      cdn: undefined,
      // scale: 1.2,
      // warn: true,
      customizations: {
        // customize: (defaultCustomizations, data, name) => {
        //   // Make icon square
        //   const width = data.width ?? 16;
        //   const height = data.height ?? 16;
        //   if (height > width) {
        //     // Set width to match height
        //     data.width = height;
        //     // Center icon horizontally by changing viewBox left position
        //     data.left = (data.left ?? 0) - (height - width) / 2;
        //   }
        //   return defaultCustomizations;
        // },
      },
    }),
  ],
  variants: [
    // {
    //   match: (s) => {
    //     if (s.startsWith("i-")) {
    //       return {
    //         matcher: s,
    //         selector: (s) => {
    //           return s.startsWith(".") ? `${s.slice(1)},${s}` : s;
    //         },
    //       };
    //     }
    //   },
    // },
  ],
});
